<template>
	<view>
		<view style="min-height: 100rpx;"></view>
		<view class="cu-bar tabbar bg-white tabbottom" style="min-height: 50px;border-top:0.5px solid #ABABAB;">
			<view class="action" v-for="(item, index) in tabList" :key="index" @tap="switchTab(item.pagePath, index)">
				<view class="cuIcon-cu-image"><image :src="currentTabIndex == index ? item.selectedIconPath : item.iconPath" style="width: 24px;height: 24px;"></image></view>
				<view v-if="item.text" :class="currentTabIndex == index ? 'selectedTextColor' : 'textColor'">{{ item.text }}</view>
			</view>
		</view>
	</view>
</template>
<script>
export default {
	data() {
		return {
			tabList: [
				{
					pagePath: '../index/main',
					iconPath: '/static/icon/tab-home.png',
					selectedIconPath: '/static/icon/tab-home-current.png',
					text: '首页'
				},
				{
					pagePath: '../jian/main',
					iconPath: '/static/icon/tab-like.png',
					selectedIconPath: '/static/icon/tab-like-current.png',
					text: '优选'
				},
				{
					pagePath: '../sou/main',
					iconPath: '/static/icon/tab-search.png',
					selectedIconPath: '/static/icon/tab-search-current.png'
				},
				{
					pagePath: '../wallet/main',
					iconPath: '/static/icon/tab-wallet.png',
					selectedIconPath: '/static/icon/tab-wallet-current.png',
					text: '钱包'
				},
				{
					pagePath: '../user/main',
					iconPath: '/static/icon/tab-my.png',
					selectedIconPath: '/static/icon/tab-my-current.png',
					text: '我的'
				}
			],
			currentTabIndex: this.current
		};
	},
	props: {
		current: { type: [Number, String], default: 0 }
	},
	methods: {
		switchTab(url, index) {
			if (index == 3 || index == 4) {
				if (!this.$util.Landing()) {
					uni.navigateTo({
						url: '../access/main'
					});
				} else {
					uni.switchTab({
						url: url
					});
				}
			} else {
				uni.switchTab({
					url: url
				});
			}
		}
	}
};
</script>
<style>
.textColor {
	font-size: 10px;
	color: #bfbfbf;
}
.selectedTextColor {
	font-size: 10px;
	color: #e77984;
}
.tabbottom {
	position: fixed;
	bottom: 0rpx;
	left: 0rpx;
	z-index: 9998;
	background-color: #ffffff;
	width: 100%;
	text-align: center;
}
</style>
